<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../util/jquery-3.4.0.js"></script>
    <link rel="stylesheet" href="../css/zxp-Notice.css">
    <link rel="stylesheet" href="../util/layui-v2.4.5/layui/css/layui.css">
    <link rel="stylesheet" href="../util/bootstrap-3.3.7/dist/css/bootstrap.css">
    <script src="../util/layui-v2.4.5/layui/layui.js"></script>
    <script src="../util/bootstrap-3.3.7/dist/js/bootstrap.js"></script>
</head>
<body>
    <div id="box">
        <div class="layui-tab" lay-filter="demo">
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <p class="p-1"><strong>标题</strong></p>
                    <input type="text" id="Tit" name="title" required lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
                    <p class="p-1"><strong>内容</strong></p>
                    <textarea id="demo" style="display: none;"></textarea>
                    <p id="two">
                        <input type="checkbox" id="yes">发布到首页公告
                        <input type="checkbox">顶置
                        <input type="checkbox">发布到电子屏
                        <input type="checkbox">首行缩进
                    </p>
                    <p id="three">
                        <button class="layui-btn layui-btn-sm ok">保存</button>
                        <button class="layui-btn layui-btn-sm no">取消</button>
                    </p>
                </div>

            </div>
        </div>

    </div>
</body>
<script>
    layui.use('element', function(){
        var element = layui.element;

        //一些事件监听
        element.on('tab(demo)', function(data){
            console.log(data);
        });
    });

    layui.use('layedit', function(){
        var layedit = layui.layedit;
        layedit.build('demo'); //建立编辑器
    });
    
    $(function () {
        var arr=[];
        $('.ok').click(function () {
            var oTit=$('#Tit').val();
            var oVal=$("#LAY_layedit_1").contents().find('body').html();
            arr.push({
                title: oTit,
                txt: oVal
            });
            var aaa=JSON.stringify(arr);
            localStorage.setItem('bbb',aaa);
            document.getElementById("LAY_layedit_1").contentWindow.document.body.innerText = "";
            $("#Tit").val("");
        })
    })
</script>
</html>